/*Created by lk on 2020/06/04.*/

/*----banner----*/
.banner{width: 100%; position: fixed; top: 0;}
.banner .swiper-slide{width: 100%; height: 100%}
.banner .img{width: 100%; height: 100%; background-position: center; background-size: cover}

.banner .banner_arrow{width: 130px; height: 350px; background: url("../image/ico08.png") no-repeat; position: absolute; right: 0; top: 0; margin: 370px 300px 0 0; z-index: 9}

.banner .swiper-slide-active .img{animation: zoom 5s cubic-bezier(0.42,0,0.58,1); -webkit-animation: zoom 5s cubic-bezier(0.42,0,0.58,1); animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards}

.banner_txt{position: absolute; width: 50%; top: 34%; left: 50%; text-align: center; margin-left: -25%; z-index: 9}
.banner_txt h1{font-size: 80px; color: #fff; font-family: 'novecentowide-book'}
.banner_txt .line{display: block; width: 80%; height: 2px; margin: 20px auto 40px auto; background: #fff;}
.banner_txt h3{font-size: 22px; color: #fff; margin-bottom: 20px; font-weight: 100}
.banner_txt p{font-size: 14px; color: #fff; padding: 0 16%; line-height: 24px; font-weight: 100}


@keyframes zoom {
    0%{transform: scale(1.2)}
    100%{transform: scale(1)}
}
@-webkit-keyframes zoom {
    0%{transform: scale(1.2)}
    100%{transform: scale(1)}
}

.mark{width: 100%; height: 820px; position: relative;}



/*----content------*/
.content{position: relative; background: #fff; z-index: 9;}

.title{padding-bottom: 60px; position: relative; text-align: center}
.title h6{font-size: 36px; color: #d0d0d0; font-family:'novecentowide-book'}
.title h3{font-size: 38px; color: #dedede; letter-spacing: 2px; line-height: 36px; margin-bottom: 20px; font-family: 'DisneyEnglish-Bold'}
.title h1{font-size: 22px; color: #181818; letter-spacing: 2px;}
.title .line{display: block; width: 160px; height: 2px; background: #008cd7; margin: 14px auto 0 auto}

.a_link{width: 140px;  text-align: center; padding: 10px 0; border: 1px solid #dedede; margin-top: 60px; position: relative; overflow: hidden; font-family: 'novecentowide-book'}
.a_link i{font-size: 13px; color: #333; font-style: normal; position: relative; z-index: 2; transition: all ease .4s; -webkit-transition: all ease .4s}
.a_link:before{content: ""; display: block; width: 0; height: 100%; background: #006255; position: absolute; top: 0; left: 0; transition: all ease .4s; -webkit-transition: all ease .4s}
.a_link:hover:before{width: 100%}
.a_link:hover i{color: #fff;}

/*----list01----*/
.list01{padding: 100px 0; position: relative; overflow: hidden}
.list01 .list01_con{}
.list01 .list01_con .list{}
.list01 .list01_con .list li{width: 33.3333%; padding: 70px 40px; float: left; border-top: 1px solid #f0f0f0; border-right: 1px solid #f0f0f0; box-sizing: border-box; position: relative; overflow: hidden; transition: all ease .4s; -webkit-transition: all ease .4s}
.list01 .list01_con .list li:before{content: ""; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; overflow: visible; border: 0 solid #008cd7; transition: all ease-in-out .3s; -webkit-transition: all ease-in-out .3s}
.list01 .list01_con .list li .ico{width: 30%; position: relative; z-index: 1; transition: all ease .4s; -webkit-transition: all ease .4s}
.list01 .list01_con .list li .ico img{width: 80px; float: none; display: block; margin: 0 auto}
.list01 .list01_con .list li .ico .ico_on{position: absolute; top: 0; left: 50%; margin-left: -40px; opacity: 0;}
.list01 .list01_con .list li .txt{width: 70%; padding-left: 10%; position: relative; z-index: 1; transition: all ease .4s; -webkit-transition: all ease .4s}
.list01 .list01_con .list li .txt h1{font-size: 22px; color: #333; transition: all ease .4s; -webkit-transition: all ease .4s}
.list01 .list01_con .list li .txt .line{display: block; width: 120px; height: 1px; background: #dedede; margin: 10px 0;  transition: all ease .4s; -webkit-transition: all ease .4s}
.list01 .list01_con .list li .txt p{font-size: 14px; color: #8b8b8b; font-family: 'novecentowide-book'; transition: all ease .4s; -webkit-transition: all ease .4s}
.list01 .list01_con .list li .ac{width: 30px; height: 30px; background: url("../image/ico07.png") no-repeat; position: absolute; bottom: 0; left: 0; margin: 0 0 40px -30px; transition: all ease .4s; -webkit-transition: all ease .4s}

.list01 .list01_con .list li:nth-child(1){border-left: 1px solid #f0f0f0;}
.list01 .list01_con .list li:nth-child(2){background: url("../image/c1.jpg") no-repeat center; background-size: cover}
.list01 .list01_con .list li:nth-child(4){border-left: 1px solid #f0f0f0; border-bottom: 1px solid #f0f0f0; background: url("../image/c2.jpg") no-repeat center; background-size: cover}
.list01 .list01_con .list li:nth-child(5){border-bottom: 1px solid #f0f0f0}
.list01 .list01_con .list li:nth-child(6){border-bottom: 1px solid #f0f0f0; background: url("../image/c3.jpg") no-repeat center; background-size: cover}

.list01 .list01_con .list li:nth-child(even) .txt h1{color: #fff;}
.list01 .list01_con .list li:nth-child(even) .txt .line{background: #fff;}
.list01 .list01_con .list li:nth-child(even) .txt p{color: #fff;}

.list01 .list01_con .list li:hover:before{border: 110px solid #008cd7; opacity: 1}
.list01 .list01_con .list li:hover .ico{transform: translateX(200%); -webkit-transform: translateX(200%)}
.list01 .list01_con .list li:hover .txt{transform: translateX(-50%); -webkit-transform: translateX(-50%)}

.list01 .list01_con .list li:hover:hover .ico .ico_on{opacity: 1}

.list01 .list01_con .list li:hover .txt h1{color: #fff;}
.list01 .list01_con .list li:hover .txt .line{background: #fff;}
.list01 .list01_con .list li:hover .txt p{color: #fff;}

.list01 .list01_con .list li:hover .ac{margin: 0 0 40px 48px;}

/*----list02----*/
.list02{position: relative; overflow: hidden}

.list02 .list02_con{position: relative; z-index: 2}
.list02 .list02_con .list{width: 46%; margin-left: 54%;}
.list02 .list02_con .list li{position: relative; width: 100%; height: 240px; padding: 70px 180px 0 70px; background: rgba(0,0,0,.2); border-bottom: 1px solid rgba(255,255,255,.4); box-sizing: border-box; overflow: hidden; transition: all ease .4s; -webkit-transition: all ease .4s}
.list02 .list02_con .list li:before{content: ""; display: block; width: 40px; height: 40px; background: url("../image/ico08.png") no-repeat; position: absolute; top: 0; right: 0; margin: 16% 50px 0 0}
.list02 .list02_con .list li h1{font-size: 18px; color: #fff; margin-bottom: 20px;}
.list02 .list02_con .list li h6{font-size: 13px; color: #fff; line-height: 22px; font-family: 'novecentowide-book'}

.list02 .list02_con .list li.on{background: rgba(255,255,255,.6)}
.list02 .list02_con .list li.on h1{color: #181818}
.list02 .list02_con .list li.on h6{color: #181818}

.list02 .list02_bg{width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
.list02 .list02_bg .bg_b{width: 100%; height: 100%; background-position: center; background-size: cover; position: absolute; top: 0; left: 0; opacity: 0; overflow: hidden; transition: all ease 2s; -webkit-transition: all ease 2s}
.list02 .list02_bg .bg_b.active{transform: scale(1); -webkit-transform: scale(1); opacity: 1}

.list02 .list02_bg .bg_b .txt{position: absolute; top: 0; left: 0; margin: 10% 0 0 15%;}
.list02 .list02_bg .bg_b .txt h1{font-size: 24px; color: #fff; margin-bottom: 40px;}
.list02 .list02_bg .bg_b .txt p{font-size: 32px; color: #fff; line-height: 50px;}

/*----list03----*/
.list03{position: relative; overflow: hidden; padding: 80px 0 160px 0}

.list03 .list03_con{position: relative; z-index: 2}
.list03 .list03_con .list{text-align: center; margin-bottom: 40px;}
.list03 .list03_con .list li{display: inline-block; width: 140px; margin: 0 10px; transition: all ease .4s; -webkit-transition: all ease .4s}
.list03 .list03_con .list li a{width: 140px; padding: 8px 0; font-size: 14px; color: #fff; background: #008cd7; border-radius: 16px;}

.list03 .list03_bg{width: 1280px; margin: 0 auto;}
.list03 .list03_bg .bg_c{display: none; transition: all ease 2s; -webkit-transition: all ease 2s}
.list03 .list03_bg .bg_c img{float: none; display: block; width: 100%}
.list03 .list03_bg .bg_c.active{display: block;}

.list03 .list03_bg .bg_c .txt{position: absolute; bottom: 0; left: 50%; width: 560px; background: #008cd7; margin: 0 0 -100px -280px; padding: 50px 100px; text-align: center}
.list03 .list03_bg .bg_c .txt h1{font-size: 18px; color: #fff; margin-bottom: 20px;}
.list03 .list03_bg .bg_c .txt p{font-size: 14px; color: #fff; line-height: 24px;}

/*----list04----*/
.list04{position: relative; padding: 160px 0; background: url("../image/c7.jpg") no-repeat center; background-size: cover; overflow: hidden}
.list04:before{content: ""; display: block; width: 100%; height: 1px; background: rgba(255,255,255,.5); position: absolute; top: 0; left: 0; margin: 548px 0 0 0}

.list04 .title h6{color: #fff;}
.list04 .title h3{color: #fff;}
.list04 .title h1{color: #fff;}
.list04 .title .line{background: #fff;}

.list04 .list04_con{margin-top: 40px;}
.list04 .list04_con .list{margin-right: -2.28%}
.list04 .list04_con .list li{width: 12%; margin-right: 2.28%; float: left; text-align: center; cursor: pointer}
.list04 .list04_con .list li .ico{width: 80px; margin: 0 auto 30px auto; transition: all ease .4s; -webkit-transition: all ease .4s}
.list04 .list04_con .list li .ico img{float: none; display: block;}
.list04 .list04_con .list li span{display: block;}
.list04 .list04_con .list li .radius{width: 74px; height: 74px; background: transparent; margin: 0 auto 20px auto; border-radius: 100%; box-sizing: border-box; position: relative; transition: all ease .4s; -webkit-transition: all ease .4s}
.list04 .list04_con .list li .radius i{display: block; font-size: 14px; color: #fff; font-style: normal; padding: 60px 0 0 0; text-align: center; font-family:  'novecentowide-book'; position: relative; z-index: 2; transition: all ease .4s; -webkit-transition: all ease .4s}
.list04 .list04_con .list li .radius:before{content: ""; display: block; width: 9px; height: 9px; background: #fff; border-radius: 100%; position: absolute; top: 0; left: 50%; margin: 32px 0 0 -4px; transition: all ease .3s; -webkit-transition: all ease .3s}
.list04 .list04_con .list li .radius:after{content: ""; display: block; width: 74px; height: 74px; border: 1px solid rgba(255,255,255,.6); border-radius: 100%; position: absolute; top: 0; left: 50%; margin-left: -37px; opacity: 0; box-sizing: border-box; transform: scale(0.5); -webkit-transform: scale(0.5); transition: all ease .5s; -webkit-transition: all ease .5s}
.list04 .list04_con .list li h1{font-size: 16px; color: #fff;}
.list04 .list04_con .list li .line{width: 20px; height: 1px; background: rgba(255,255,255,.5); margin: 18px auto 22px auto}
.list04 .list04_con .list li p{font-size: 12px; color: #fff; opacity: 0; transform: translateY(10px); -webkit-transform: translateY(10px); transition: all ease .4s; -webkit-transition: all ease .4s}

.list04 .list04_con .list li:hover .ico{transform: rotateY(180deg); -webkit-transform: rotateY(180deg)}
.list04 .list04_con .list li:hover .radius:before{width: 58px; height: 58px; background: #008cd7; margin: 8px 0 0 -29px;}
.list04 .list04_con .list li:hover .radius:after{transform: scale(1); -webkit-transform: scale(1); opacity: 1}
.list04 .list04_con .list li:hover .radius i{padding: 30px 0 0 0;}
.list04 .list04_con .list li:hover p{transform: translateY(0); -webkit-transform: translateY(0); opacity: 1}

.list04 .list04_con .list li:nth-child(1){animation-delay: .4s; -webkit-animation-delay: .4s}
.list04 .list04_con .list li:nth-child(2){animation-delay: .5s; -webkit-animation-delay: .5s}
.list04 .list04_con .list li:nth-child(3){animation-delay: .6s; -webkit-animation-delay: .6s}

/*----list05----*/
.list05{padding: 80px 0; overflow: hidden}
.list05 .list05_left{width: 55%;}
.list05 .list05_left .img{width: 100%; overflow: hidden}
.list05 .list05_left .img img{width: 100%;}
.list05 .list05_right{width: 45%; border: 1px solid #dedede; border-left: none; padding: 80px 50px 70px 50px;}
.list05 .list05_right h4{font-size: 14px; color: #333; line-height: 26px; margin-bottom: 50px; text-align: center}
.list05 .list05_right .list{margin-right: -2%;}
.list05 .list05_right .list li{width: 18%; margin-right: 2%; float: left; cursor: pointer}
.list05 .list05_right .list li .ico{width: 60px; margin: 0 auto; transition: all ease .4s; -webkit-transition: all ease .4s}
.list05 .list05_right .list li .ico img{display: block; float: none;}
.list05 .list05_right .list li p{font-size: 14px; color: #333; text-align: center; padding: 10px 0}

.list05 .list05_right .list li:hover .ico{transform: rotateY(360deg); -webkit-transform: rotateY(360deg)}


/*----list06----*/
.list06{padding: 40px 0 80px 0; overflow: hidden}
.list06 .list06_con{}
.list06 .list06_con .list{margin-right: -3.3333%}
.list06 .list06_con .list li{width: 30%; margin-right: 3.3333%; float: left;}
.list06 .list06_con .list li .img{width: 100%; height: 220px; overflow: hidden}
.list06 .list06_con .list li .img img{width: 100%; transition: all ease .4s; -webkit-transition: all ease .4s}
.list06 .list06_con .list li .txt{padding: 20px 30px 30px 30px; background: #f0f0f0; position: relative; transition: all ease .4s; -webkit-transition: all ease .4s}
.list06 .list06_con .list li .txt h1{font-size: 16px; color: #666; margin-bottom: 10px; transition: all ease .4s; -webkit-transition: all ease .4s}
.list06 .list06_con .list li .txt p{font-size: 13px; color: #999; line-height: 22px; margin-bottom: 10px; transition: all ease .4s; -webkit-transition: all ease .4s}
.list06 .list06_con .list li .txt h6{font-size: 14px; color: #999; font-family:  'novecentowide-book'; transition: all ease .4s; -webkit-transition: all ease .4s}
/*.list06 .list06_con .list li .txt span{display: block; width: 34px; height: 34px; background: url("../image/ico21.png") no-repeat; position: absolute; bottom: 0; right: 0; margin: 0 20px 20px 0}*/

.list06 .list06_con .list li:hover .img img{transform: scale(1.1); -webkit-transform: scale(1.1)}
.list06 .list06_con .list li:hover .txt{background: #008cd7}
.list06 .list06_con .list li:hover .txt h1{color: #fff}
.list06 .list06_con .list li:hover .txt p{color: #fff;}
.list06 .list06_con .list li:hover .txt h6{color: #fff;}

/*----list07----*/
.list07{padding: 100px 0 20px 0; background: url("../image/c9.jpg") no-repeat center; background-size: cover; overflow: hidden}
.list07 .title h6{color: #fff;}
.list07 .title h3{color: #fff;}
.list07 .title h1{color: #fff;}
.list07 .title .link{width: 40px; height: 40px; margin: 40px auto 0 auto; background: url("../image/ico08.png") no-repeat; transition: all ease .4s; -webkit-transition: all ease .4s}
.list07 .title .link:hover{transform: rotateY(360deg); -webkit-transform: rotateY(360deg)}